import { computed, ref } from "vue";
import usePatrolingStore from "@/store/patroling";
import { storeToRefs } from "pinia";
import { ElNotification, ElMessage } from "element-plus";
const patrolingStore = usePatrolingStore();
const { patrolingInfo } = storeToRefs(patrolingStore);

export default (missionId) => {
  // 操作定时任务
  const timingTaskList = [
    {
      title: "新建定时任务",
      color: "#FF931E",
      value: "createTimingTask",
    },
    {
      title: "搜索定时任务",
      color: "#1F3947",
      value: "selectTimingTask",
    },
  ];

  const timingTaskListVisible = ref(false);

  const createTimingTaskVisible = ref(false);

  const loopConditionsMap = {
    DAY: "1",
    WEEK: "2",
    SINGLE: "3",
  };

  const timingFormOptions = ref([
    {
      prop: "loopConditions",
      label: "循环条件",
      customRender() {
        const options = [
          {
            value: loopConditionsMap.DAY,
            label: "每天",
          },
          {
            value: loopConditionsMap.WEEK,
            label: "每周",
          },
          {
            value: loopConditionsMap.SINGLE,
            label: "单次",
          },
        ];
        return (
          <el-select
            placeholder="请选择"
            class="w-full"
            onChange={handleLoopConditionChange}
          >
            {options.map((item) => {
              return (
                <el-option label={item.label} value={item.value}></el-option>
              );
            })}
          </el-select>
        );
      },
    },
    {
      prop: "conditions",
      label: "循环时间",
      customRender() {
        const options = [
          {
            value: 1,
            label: "周一",
          },
          {
            value: 2,
            label: "周二",
          },
          {
            value: 3,
            label: "周三",
          },
          {
            value: 4,
            label: "周四",
          },
          {
            value: 5,
            label: "周五",
          },
          {
            value: 6,
            label: "周六",
          },
          {
            value: 7,
            label: "周日",
          },
        ];
        return (
          <el-checkbox-group disabled={conditionsDisabled.value}>
            {options.map((item) => {
              return <el-checkbox label={item.value}>{item.label}</el-checkbox>;
            })}
          </el-checkbox-group>
        );
      },
    },
    {
      prop: "time",
      label: "下发时间",
      type: "datePicker",
      customRender() {
        return (
          <el-date-picker
            type="datetime"
            placeholder="请选择"
            default-value={new Date()}
            format="YYYY-MM-DD HH:mm"
            value-format="YYYY-MM-DDTHH:mm"
            size="small"
          />
        );
      },
    },
    {
      prop: "changeMission",
      label: "返回充电点",
      customRender() {
        return <el-switch active-color="#ff931e" />;
      },
    },
  ]);

  const timingformData = ref({});
  /**
   * @description: 确定新建定时任务
   * @param {*} data
   * @return {*}
   */
  async function handleTimingConfirm() {
    timingformData.value.code = patrolingInfo.value.robotid;
    if (!timingformData.value.time || !timingformData.value.loopConditions) {
      ElNotification({
        type: "warning",
        title: "提醒",
        message: "请先选择好下发时间或条件",
      });
      return;
    }
    const data = { ...timingformData.value };
    data.code = patrolingInfo.value.robotid;
    data.conditions = data.conditions
      ? data.conditions.sort((a, b) => a - b).toString()
      : "";
    data.missionId = missionId.value;
    data.changeMission = !!data.changeMission;
    await createTimingTask(data);
    ElMessage.success({
      message: "发送成功",
    });
    createTimingTaskVisible.value = false;
    patrolingStore.clearPath();
    missionId.value = false;
  }

  function handleLoopConditionChange(value) {
    if (value === loopConditionsMap.DAY) {
      timingformData.value.conditions = [1, 2, 3, 4, 5, 6, 7];
    } else {
      timingformData.value.conditions = [];
    }
  }

  const conditionsDisabled = computed(() => {
    return ["1", "3", undefined, ""].includes(
      timingformData.value.loopConditions
    );
  });

  function createTimingTask() {
    if (!missionId.value) {
      ElNotification({
        message: "请先选择模板",
        type: "warning",
      });
      return;
    }
    createTimingTaskVisible.value = true;
  }

  return {
    timingTaskList,
    timingTaskListVisible,
    createTimingTaskVisible,
    handleTimingConfirm,
    timingformData,
    timingFormOptions,
    createTimingTask,
  };
};
